<template>
  <div class="content">
      <el-upload
        class="upload-demo"
        action=""
        :on-preview="handlePreview"
        :on-remove="handleRemove"
        :http-request="uploadFile"
        :file-list="fileList"
        list-type="picture"
        >
          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
          <el-button style="margin-left: 10px;" size="small" type="success" @click="saveFile">上传</el-button>
        <div slot="tip" class="el-upload__tip"></div>
      </el-upload>
      <!-- <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器</el-button> -->
  </div>
</template>

<script>
  import { materialUpload,saveFileLog } from "@/api/shop";
  export default {
    data() {
      return {
        fileList: [],
        formData:new FormData(),
        saveData: [],
      };
    },
    methods: {
      handleRemove(file) {
        let saveData =this.saveData;
        let i=0;
        for(i =0;i<saveData.length;i++)
        {
          if(file.uid==saveData[i]['uid'])
          {
            break;
          }
        }
        if(i == saveData.length)
        {
          this.$message({
            type: "info",
            message: "未找到对应文件"
          });
        }
        saveData.splice(i,1);
        this.saveData = saveData;
      },
      uploadFile(file){
        console.log(file);
        var formData = new FormData();
        formData.append("file", file.file);
        formData.append("uid", file.file.uid);

        materialUpload(formData).then(res => {
          if(res.code == 200)
          {
            let data = new Array();
            data.file_path=res.data.file_path;
            data.create_time=res.data.create_time;
            data.size=res.data.size;
            data.name=res.data.name;
            data.uid=parseInt(res.data.uid);
            this.saveData.push(data);
          }
        });
      },
      saveFile(){
        saveFileLog({...this.saveData}).then(res=>{

        });
      }
    }
  }
</script>
<style>

</style>
